﻿@using MvcAngular.ViewModels
@model ToDoViewModel
@{
    ViewBag.Title = "ToDo";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Todo</h2>
@using (var todoController = Html.AjCreateController<ToDoViewModel>())
{
<div @Html.AjController(m => todoController)>
      <span>@Html.AjText(m => m.Remaining()) of @Html.AjText(m => m.ToDos.Count) remaining</span>
      [ <a href="" >archive</a> ]
      <ul class="unstyled">
          @{MvcAngular.ViewModels.ToDoViewModel.ToDoItem todo = null; }
        <li @Html.AjRepeat(m => m.ToDos, m2 => todo) >
          <input type="checkbox" ng-model="todo.done">
          <span class="done-{{todo.done}}">{{todo.text}}</span>
        </li>
      </ul>
      <form ng-submit="addTodo()">
        <input type="text" @Html.AjModel(m => m.ToDoText)  size="30" placeholder="add new todo here">
        <input class="btn-primary" type="submit" value="add">
      </form>
</div>
}
